<!DOCTYPE html>
<html lang="en">

<head>
    <meta charset="UTF-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
<!--    <meta name="viewport" content="width=device-width, initial-scale=1.0">-->
    <title>博客中心</title>
    <link rel="icon" href="pict/login.png" sizes="16x16">
    <link rel="stylesheet" href="css/specticalper.css">
    <link rel="stylesheet" href="css/specal2.css?v=1">
    <script src="js1/jquery.min.js"></script>
</head>

<body>
<!-- 导航栏 -->
<div class="nav">
    <img src="images/others/head_new.jpg" alt="">
    <span class="title">博客系统</span>
    <!-- 用来占据中间位置-->
    <span class="spacer"></span>
    <a href="index1.html">主页</a>
    <a href="blog_write.html">写博客</a>
    <a href="mycollect.html">收藏</a>
    <a href="explain.html">博客说明</a>
    <a id="islogin" href="javascript:logout()">退出</a>
    <!--<a href="#">注销</a>-->
</div>
<!-- 版心 -->
<div class="container">
    <!-- 左侧个人信息 -->
    <div class="container-left">
        <div class="card">
            <img src="images/login/login1.png" class="avtar" alt="">
            <ul class="card_ul">
               <li><p id="username"></p></li>
                <li>  <a  href="https://gitee.com/login" target="_blank">gitee 地址</a>
                </li>
              <li class="counter">
                    <span >文章</span>
                </li>
                <li class="counter">
                    <span id="acount"></span>

                </li>
            </ul>
        </div>
    </div>
    <!-- 右侧内容详情 -->
    <div id="artlist" class="container-right">
        <div id="unart" style="text-align:center;display:none;">
            <h3>当前用户未发表文章</h3>
        </div>
        <!-- 每一篇博客包含标题, 摘要, 时间 -->
    </div>
</div>
<div class="btn-box">
    <div onclick="change('light')" id="l">日间模式
    </div>
    <div onclick="change('dark')" id="d">夜间模式
    </div>
</div>
<div class="dark" id="container">
    <div class="bg"></div>
    <div class="moon-box">
        <div class="moon"> </div>
    </div>
    <div class="sun-box">
        <div class="sun"></div>
    </div>
<!--    <div class="sea"></div>-->
</div>
<script>
    function change(str){
        document.getElementById("container").setAttribute('class',str);
    }
    var uid = 0;

    //1.查询用户的信息
    function myUserInfo() {
        jQuery.ajax({
            url: "loginUserInfo",
            type: "POST",
            data: "",
            success: function (result) {
                if (result != null) {

                    //前后端交互正常
                    if (result.id != null) {

                        //登录成功
                        jQuery("#username").text(result.username);

                        uid = result.id;

                        createArtList();

                    } else {
                        alert("抱歉，请先登录！");
                        location.href="login_new.jsp";
                    }
                } else {
                    alert("抱歉！后端程序不可用，请您稍后再试！?");
                }
            }
        });
    };
    myUserInfo();

    //2.得到用户的文章列表
    function createArtList() {
        jQuery.ajax({
            url: "myarticlelist",
            type: "POST",
            data: {"uid": uid},
            success: function (result) {
                if (result != null) {
                    if (result != null && result.length > 0) {
                        jQuery("#acount").text(result.length);
                        //当前用户有发表文章
                        var artHtml = '';
                        for (var i = 0; i < result.length; i++) {
                            var article = result[i];
                            artHtml += '<div class="blog">' +
                                ' <div class="title">' + article.title + '</div>' +
                                '<div class="date">' + article.createtime + '</div>' +
                                ' <div class="desc">' + article.context.substring(0, 10) + "..." + '</div>' +
                                ' <div style="text-align: center;"> <a href="blog_content.html?aid='
                                + article.aid + '" class="detail2">查看全文 &gt;&gt;</a>&nbsp; &nbsp;<a href="blog_edit.html?aid='
                                + article.aid + '" class="detail2" style="color: brown;"> 修 改 </a>&nbsp; &nbsp; <a href="javascript:del('
                                + article.aid + ');" class="detail2" style="color: red;"> 删 除 </a>&nbsp; &nbsp; </div></div><hr>';
                        }
                        jQuery("#artlist").html(artHtml);
                    } else {
                        //当前用户未发表文章
                        jQuery("#unart").show();
                    }
                }
            }
        });
    };

    //退出事件
    function logout() {
        if (confirm("是否退出？")) {
            //1.session清空
            jQuery.ajax({
                url: "loginout",
                type: "POST",
                success: function (result) {
                    if (result != null && result == 1) {
                        alert("退出成功！");
                        location.href = "index.html";
                    } else {
                        alert("抱歉，操作出错，请重试！");
                    }
                }
            });

        }
    }

    //删除文章
    function del(aid) {
        if (confirm("是否确认删除？")) {
            if (aid != null && aid > 0) {
                jQuery.ajax({
                    url: "delart",
                    type: "POST",
                    data: {"aid": aid},
                    success: function (result) {
                        if (result != null && result == 1) {
                            alert("删除成功");
                            location.href = location.href;
                        } else {
                            alert("抱歉，操作失败，请重试！");

                        }
                    }
                });
            }
        }
    }
</script>
</body>

</html>